{% block sw_settings_sso_user_create_access_key_modal %}
<sw-modal
    v-if="isOpen"
    class="sw-settings-sso-user-create-access-key-modal"
    size="550px"
    :title="$tc('global.default.warning')"
    :is-loading="isLoading"
    @modal-close="onCancel()"
>
    {% block sw_settings_sso_user_create_access_key_modal_inner %}
    {% block sw_settings_sso_user_create_access_key_modal_inner_field_access_key %}
    <mt-text-field
        v-model="accessKey"
        :label="$tc('sw-users-permissions.users.user-detail.modal.idFieldLabel')"
        :disabled="true"
        :copyable="true"
        :copyable-tooltip="true"
        class="sso-user-Integrations-modal-field--access-key"
    />
    {% endblock %}

    {% block sw_settings_sso_user_create_access_key_modal_inner_field_secret_access_key_field %}
    <mt-password-field
        v-if="mode === 'view'"
        v-model="secretAccessKey"
        :label="$tc('sw-users-permissions.users.user-detail.modal.secretFieldLabel')"
        :disabled="true"
        :toggable="false"
        autocomplete="off"
        class="sso-user-Integrations-modal-field--secret-acces-key"
    />

    <mt-text-field
        v-else
        v-model="secretAccessKey"
        :label="$tc('sw-users-permissions.users.user-detail.modal.secretFieldLabel')"
        :disabled="true"
        :copyable="true"
        :copyable-tooltip="true"
        class="sso-user-Integrations-modal-field--secret-acces-key"
    />
    {% endblock %}

    {% block sw_settings_sso_user_create_access_key_modal_inner_help_text %}
    <mt-banner
        v-if="mode === 'view'"
        variant="attention"
    >
        {{ $tc('sw-users-permissions.users.user-detail.modal.hintCreateNewApiKeys') }}
    </mt-banner>

    <mt-banner
        v-else
        variant="attention"
    >
        {{ $tc('sw-users-permissions.users.user-detail.modal.secretHelpText') }}
    </mt-banner>
    {% endblock %}

    {% block sw_settings_sso_user_create_access_key_modal_inner_generate_new_key_button %}
    <mt-button
        v-if="mode === 'view'"
        variant="critical"
        :block="true"
        class="sso-user-Integrations-modal-field--generate-access-key"
        @click="onGenerateNewAccessKey()"
    >
        {{ $tc('sw-users-permissions.users.user-detail.modal.buttonCreateNewApiKeys') }}
    </mt-button>
    {% endblock %}

    {% block sw_settings_sso_user_create_access_key_modal_inner_footer %}
    <template #modal-footer>
        {% block sw_settings_sso_user_create_access_key_modal_inner_footer_cancel %}
        <mt-button
            class="sso-user-Integrations-modal--cancel"
            size="small"
            variant="secondary"
            :disabled="isLoading"
            @click="onCancel()"
        >
            {{ $tc('global.default.cancel') }}
        </mt-button>
        {% endblock %}

        {% block sw_settings_sso_user_create_access_key_modal_inner_footer_save %}
        <mt-button
            class="sso-user-Integrations-modal--apply"
            size="small"
            variant="primary"
            :is-loading="isLoading"
            @click="onSave()"
        >
            {{ $tc('sw-users-permissions.users.user-detail.modal.buttonApply') }}
        </mt-button>
        {% endblock %}
    </template>
    {% endblock %}
    {% endblock %}
</sw-modal>
{% endblock %}
